<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/moren.css">
    <link rel="stylesheet" href="./css/xiangqing.css">
    <link rel="stylesheet" href="./css/Swiper.css">
    <script src="./js/flexible.js"></script>
    <script src="./js/jquery.min.js"></script>
    <script src="./js/Swiper.js"></script>
    <title>详介绍情</title>
</head>

<body>
    <div class="xiangqing">
        <!-- 轮播图 -->
        <div class="xq-lun">
            <div class="swiper mySwiper xq-lun">
                <div class="swiper-wrapper ">
                    <div class="swiper-slide">
                        <div class="img">
                            <img src="./images/web_详情/组 1401@2x.png" alt="">
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="img">
                            <img src="./images/web_详情/组 1401@2x.png" alt="">
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="img">
                            <img src="./images/web_详情/组 1401@2x.png" alt="">
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="img">
                            <img src="./images/web_详情/组 1401@2x.png" alt="">
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="img">
                            <img src="./images/web_详情/组 1401@2x.png" alt="">
                        </div>
                    </div>
                </div>
                <!-- 左边箭头 -->
                <a href="./index.html" class="img-left">
                    <img src="./images/web_详情/left arrow@2x.png" alt="">
                </a>
                <!-- 右边购物车 -->
                <a href="./gouwuche.html" class="img-right">
                    <img src="./images/web_详情/shop@2x.png" alt="">
                </a>
                <!-- 播放按钮 -->
                <div class="yuan">
                    <img src="./images/web_详情/bofang.png" alt="">
                    <div class="shi">
                        <p>00'30''</p>
                    </div>
                </div>
                <!-- 分页器 -->
                <div class="swiper-pagination fen"></div>
            </div>
        </div>
        <!-- 标价 -->
        <div class="biaojia">
            <div class="zuo">
                <span> <b>￥</b>1289.100</span>
                <span> 原价 <s>￥9.9</s></span>
            </div>
            <div class="you">
                <p>距结束仅剩</p>
                <p>
                    <span>1天</span>
                    <span>12</span>：
                    <span>12</span>：
                    <span>12</span>

                </p>
            </div>
        </div>
        <!-- 优惠劵 -->
        <div class="youhui">
            <div class="img">
                <img src="./images/web_详情/组 1316@2x.png" alt="">
            </div>
            <div class="ling">
                <span>领劵<b>></b></span>
            </div>
        </div>
        <!-- 标题 -->
        <div class="biaoti">
            <span><img src="./images/web_详情/jingxuan@2x.png" alt=""></span>
            <span>分期免息 Qianku/屏锅 qianku XR 128G 红色不动不通不信5G手机 双卡双待</span>
        </div>
        <!-- 退货图标 -->
        <div class="tuihuo">
            <img src="./images/web_详情/组 1315@2x.png" alt="">
        </div>
        <!-- 已选服务 -->
        <div class="yixuan">
            <ul>
                <li>
                    <span>已选</span>
                    <p>华为mate30 1件 官方标配<b> <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></b></p>
                </li>
                <li>
                    <span>送至</span>
                    <p>河南省 郑州市 惠济区 <br> 现在付款，尽快为你发货<b> <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></b></p>
                </li>
                <li>
                    <span>运费</span>
                    <p>免运费<b> <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></b></p>
                </li>
                <li>
                    <span>服务</span>
                    <p>7天有理由退货急速退<b> <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></b></p>
                </li>
            </ul>
        </div>
        <!-- 规格 -->
        <div class="guige">
            <span class="guige-sp0">规格</span>
            <span class="guige-sp1">
                <span>
                    <div>华为</div>
                    <div>品牌</div>
                </span>
            <span>
                    <div>Mate30</div>
                    <div>型号</div>
                </span><span>
                    <div>幻夜黑</div>
                    <div>颜色</div>
                </span><span>
                    <div>内存6/8GB</div>
                    <div>品牌</div>
                </span>
            </span>
        </div>
        <!-- 用户评价 -->
        <div class="pjia">
            <p class="p-p1">
                <span class="p-sp1">评价66万+ | 好评率99%</span>
                <a href="./pingjia.html" class="p-sp2">查看全部 <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></a>
            </p>
            <p class="p-p2">
                <span>味道好（14076）</span>
                <span>味道好（14076）</span>
            </p>
            <div class="p-p3">
                <div class="img">
                    <img src="./images/web_详情/toux.png" alt="">
                </div>
                <div class="name">1***n</div>
                <div class="p3-img">
                    <img src="./images/web_详情/members@2x.png" alt="">
                </div>
                <div class="xing">
                    <p>★★☆☆☆</p>
                </div>
            </div>
            <div class="p-p4">
                <p>发货神速，操作起来没有问题，操作起来很流畅完全没有问题。</p>
            </div>
            <div class="p-p5">
                规格：内存6/8GB
            </div>
            <div class="p-p6">
            </div>
            <p class="p-p1">
                <span class="p-sp1">问问已购用户<b>共19条问答</b> </span>
                <span class="p-sp2">查看全部 <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></span>
            </p>
            <div class="p-p7">
                <div class="img">
                    <img src="./images/web_详情/wen(1)@2x.png" alt="">
                </div>
                <div class="zi">
                    <span>手机是正品吗？</span>
                    <span>23个回答</span>
                </div>
            </div>
            <div class="p-p7">
                <div class="img">
                    <img src="./images/web_详情/wen(1)@2x.png" alt="">
                </div>
                <div class="zi">
                    <span>请问亲们购买时快递怎么样…</span>
                    <span>18个回答</span>
                </div>
            </div>
        </div>
        <!-- 商品参数 -->
        <div class="canshu">
            <p class="p-p1">
                <span class="p-sp1">商品参数</span>
                <span class="p-sp2">查看全部 <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></span>
            </p>
            <p class="can-p1">
                <span>品牌</span>
                <span>华为</span>
            </p>
            <p class="can-p1">
                <span>型号</span>
                <span>Mate30</span>
            </p>
            <p class="can-p1">
                <span>颜色</span>
                <span>幻夜黑</span>
            </p>
            <p class="can-p1">
                <span>内存</span>
                <span>内存6/8GB</span>
            </p>
            <p class="p-p1 bao">
                <span class="p-sp1">商品参数</span>
                <span class="p-sp2">查看全部 <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""></span>
            </p>
            <div class="baozhuang">
                <span>包装清单</span>
                <span>售后服务</span>
                <span>特别声明</span>
                <span>价格说明</span>
            </div>

            <div class="p-p6 ">
            </div>
            <p class="p-p1 bao">
                <span class="p-sp1">图文详情</span>
                <span class="p-sp2"> 
                    <!-- <img src="./images/web_详情/Arrow right(2)@2x.png" alt=""> -->
                </span>
            </p>
        </div>
        <!-- 最后长图片 -->
        <div class="chang-img">
            <img src="./images/web_详情/详情页@2x.png" alt="">
        </div>
        <div class="di-top">
            <div class="p1">
                <span class="p1-sp1">
                    <img src="./images/web_详情/love.png" alt="">
                    <span>客服</span>
                </span>
            </div>
            <a href="./gouwuche.html" class="p2">
                <span class="p1-sp1">
                    <img src="./images/web_详情/_shop-2@2x.png" alt="">
                    <span>购物车</span>
                </span>
            </a>
            <div class="p3">
            </div>
            <div class="p4">
                <a href="">
    加入购物车
</a>
            </div>
            <div class="p5">
                <a href="./guigexuanze.html">
                    立即购买
                </a>
            </div>

        </div>
    </div>
    <!-- 轮播图 -->
    <script>
        var swiper = new Swiper(".mySwiper", {
            pagination: {
                el: ".swiper-pagination",
                type: "fraction",
            },
            navigation: {
                nextEl: ".swiper-button-next",
                prevEl: ".swiper-button-prev",
            },
        });
    </script>
</body>

</html>